<extend name="public:base"/>

<block name="css">
    <link rel="stylesheet" href="__CSS__/member.css?v={:config('app_ver')}" />
    <link rel="stylesheet" href="__CSS__/sign.css?v={:config('app_ver')}" />
    <style>
        .inputWrapper.add_bankcard{padding-top: 10px;}
        .inputWrapper.add_bankcard td:last-child{padding: 0;}
        .inputWrapper.add_bankcard td:first-child{padding: 0 20px 0 0;}
    </style>
</block>

<block name="main">

    <div class="slide_main fr">
        <h1 class="frame_title mb10">修改密码</h1>
        <div class="frame_slide" id="rotate">

            <include file="safe:menu" />

        </div>
        <div class="frame_slide_con bd">
            <div class="registerStep noPadding">
                <!-- 修改密码 -->
                <form action="{:url('user/safe/user_pass')}" method="post" id="eidtPasswordForm">
                    <div class="inputWrapper add_bankcard" style="width: 100%;">
                        <table width="100%">
                            <tr>
                                <td class="a666" width="100px" style="line-height: 44px;" valign="top" align="right">原密码</td>
                                <td>
                                    <div class="inputBox">
                                        <input type="password" name="password" maxlength="16" value="" class="input" id="pwd0" placeholder="请输入原密码"/>
                                        <div class="inputTip"><i class="iconFont">&#xe62a;</i><span></span></div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="a666"  style="line-height: 44px;" valign="top" align="right">新密码</td>
                                <td>
                                    <div class="inputBox">
                                        <input type="password" name="password1" maxlength="16" value="" class="input" id="pwd1" placeholder="请输入8-16位字母和数字组合新密码"/>
                                        <div class="inputTip"><i class="iconFont">&#xe62a;</i><span></span></div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="a666"  style="line-height: 44px;" valign="top" align="right">确认新密码</td>
                                <td>
                                    <div class="inputBox">
                                        <input type="password" name="password2" value="" maxlength="16" class="input" id="pwd2" placeholder="请再次输入8-16位字母和数字组合新密码"/>
                                        <div class="inputTip"><i class="iconFont">&#xe62a;</i><span></span></div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td>&nbsp;</td>
                                <td>
                                    <div class="submitLine">
                                        <p class="mb20 mt10">
                                            <input type="submit" value="确认修改" class="btn_b" id="inputSubmit"/>
                                        </p>
                                    </div>
                                </td>
                            </tr>
                        </table>
                    </div>

                </form>
            </div>
        </div>
    </div>

</block>

<block name="js">

    <script type="text/javascript" src="__JS__/sign.js"></script>
    <script type="text/javascript">
        $(function () {

            /**
             * TODO：AJAX提交，disable按钮和增加样式
             */
            $(document).ajaxStart(function () {
                $('#inputSubmit').addClass("disabled").attr("disabled", true).val('正在提交');
            }).ajaxStop(function () {
                $('#inputSubmit').removeClass("disabled").attr("disabled", false).val('立即修改');
            });

            $("#pwd0").blur(function () {

                setPassword0();
                var newval = $("#pwd1").val();
                if(newval !== "" || newval.length > 0){
                    if(checkPassword0()){
                        $("#pwd1").removeClass("on")
                            .siblings(".inputTip")
                            .css("visibility","hidden").find("span").html("");
                    }
                }
            });

            $("#pwd1").blur(function () {
                setPassword0();
                setPassword1();
                checkPassword0();
            });

            $("#pwd2").blur(function () {
                setPassword0();
                setPassword1();
                setPassword2();
            });

            /**
             * TODO:AJAX 提交表单
             */
            $("#eidtPasswordForm").submit(function () {

                var self = $(this);
                setPassword0();
                setPassword1();
                checkPassword0();
                setPassword2();
                if (!(setPassword0() && checkPassword0() && setPassword1() && setPassword2())){
                    return false;
                }
                $.post(self.attr("action"), self.serialize(), success, "json");
                return false;
                function success(data) {
                    if(data.code === 1){
                        layer.alert(data.msg, {icon: 1},function (index) {
                            if (data.data || data.url) {
                                var refer = data.data || data.url;
                                layer.close(index);
                                window.location.href = refer;
                                setTimeout(function () {
                                    window.location.href = refer;
                                }, 2000);
                            }else{
                                window.location.reload();
                            }
                        });
                    }else{
                        if(data.msg !== ''){
                            layer.alert(data.msg,{icon:2});
                        }else{
                            checkErrorType(data);
                        }
                    }
                }
            });


        });
    </script>

</block>

